<template>
  <!-- 提现详情 -->
  <div class="withdraw-container">
    <div class="progress-wrapper flexbox">
      <div class="flexitem">
        <div class="flexitem">
          Progress:
        </div>
      </div>
      <div class="flexitem flexbox wrap">
        <div class="flexitem flexbox" v-for="(item, i) of progressList" :key="i">
          <div class="flexitem">{{ item.name }}</div>
          <div class="flexitem">{{ item.value }}</div>
        </div>
      </div>
    </div>

    <div class="flexbox justify-space-between">
      <div class="flexitem">Amount: </div>
      <div class="flexitem">+50</div>
    </div>

    <div class="flexbox justify-space-between">
      <div class="flexitem">Time: </div>
      <div class="flexitem">2019-9-2</div>
    </div>

    <div class="flexbox justify-space-between">
      <div class="flexitem">Trade No: </div>
      <div class="flexitem">84201410014523685</div>
    </div>

    <div class="flexbox justify-space-between">
      <div class="flexitem">Bill type: </div>
      <div class="flexitem">withdrawal</div>
    </div>

  </div>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
declare const $Vue: Vue;

@Component({
  components: {
  },
})
export default class Home extends Vue {

  private progressList: Array<any> = [{
    name: 'application',
    value: '21564',
  },{
    name: 'check',
    value: '21564',
  },{
    name: 'complete',
    value: '21564',
  }]
  protected mounted() {
    $Vue.$emit("title", {
      message: "Withdrawal Detail"
    });

    let params = this.$route.params;

  }
}
</script>
<style lang="less" scoped>
@import url(../../../../styles/variables.less);
.withdraw-container {
  width: 100%;
  height: 100%;
  padding: 0.4rem 1rem;
  box-sizing: border-box;
  > .flexbox {
    margin: 0.6rem 0.4rem;
  }
  }
</style>
